<template>
  <div class="public_height100 p20 pub_bgColorFFF">
    <div class="table_content">
      <!-- ====== 表格上方的筛选条件 start ======-->
      <div class="table_filter flex_space_between">
        <div class="flr">
          <div class="table_filter_search">
            <el-input v-model="params.commonSearch" class="pub_input pub_input_search" placeholder="请输入产品名称" clearable @keydown.enter.native="handleSearch" @clear="handleSearch">
              <img slot="prefix" src="@/assets/img/orderManagement/search.png" class="pub_imgSize16" />
            </el-input>
          </div>
          <div class="ml12">
            <el-button type="text" class="public_confirm_btn pub_button" @click="handleSearch"> 搜索 </el-button>
          </div>
        </div>
        <div class="flex_start flex_end">
          <div v-if="roleType === 1 && params.commonTag == 4" class="ml12">
            <el-button type="text" class="w108 pub_button pub_buttonGreen" @click="batchAuitBtn">
              <span class="ml0">批量审核</span>
            </el-button>
          </div>
        </div>
      </div>
      <!-- ====== 表格上方的筛选条件 end ======-->
      <el-table ref="multipleTable" size="mini" :data="tableData" tooltip-effect="dark" border :height="`${536 * $f}px`" class="wp100 mt12" @selection-change="handleSelectionChange">
        <el-table-column type="selection" align="center" :width="`${50 * $f}`" />
        <el-table-column label="产品品牌" show-overflow-tooltip prop="productBrandName" align="center" />
        <el-table-column label="产品名称" show-overflow-tooltip prop="productBrandArticleNoName" align="center" />
        <el-table-column label="货号" show-overflow-tooltip prop="productBrandArticleNo" align="center" />
        <el-table-column label="规格" show-overflow-tooltip prop="productSpecificationName" align="center" />
        <el-table-column label="税收编码" show-overflow-tooltip prop="taxCode" align="center" :width="`${280 * $f}`" />
        <el-table-column label="操作" align="center" :width="`${100 * $f}`">
          <template slot-scope="{ row }">
            <el-button type="text" class="pub_button public_1EB398_btn" size="mini" @click="auditProductBtnClick(row)">审核</el-button>
          </template>
        </el-table-column>
        <template slot="empty">
          <PageEmptyData />
        </template>
      </el-table>
      <div ref="pubPageinationRef" class="pub_pageination flex_center mt18">
        <el-pagination background layout="total,prev, pager, next,sizes" :page-size="params.pageSize" :current-page.sync="params.pageNum" :total="params.total" @current-change="changePage" @size-change="changeSize"> </el-pagination>
      </div>
    </div>
    <!-- 审核提示 -->
    <auditDialog :multiple-selection="multipleSelection" :visible="auditProductDialogVisible" @close="closedeleteProductDialog" @submit="confirmAuditProduct" />
  </div>
</template>
<script>
import tableFun from '@/mixin/tableFun.js';
export default {
  mixins: [tableFun],
  data() {
    return {
      params: { commonSearch: '', total: 0, commonTag: 4, pageSize: 20, pageNum: 1 },
      taxCodeColumns: [
        //税收编码
        { taxCode: '生物化学制品-1070307000000000000' },
        { taxCode: '化学原料及化学制品-1070200000000000000' },
        { taxCode: '橡胶制品-1070500000000000000' },
        { taxCode: '塑料制品-1070601000000000000' },
        { taxCode: '玻璃制品-1080110000000000000' },
        { taxCode: '纸及纸制品-1060100000000000000' },
        { taxCode: '金属制品-1080400000000000000' },
        { taxCode: '技术陶瓷制品-1080120000000000000' },
        { taxCode: '分析仪器及装置-1090605000000000000' },
        { taxCode: '绘图、计算及测量仪器-1090604000000000000' },
        { taxCode: '软件产品-1060301000000000000' },
        { taxCode: '研发和技术服务-3040100000000000000' },
        { taxCode: '文具及类似用品-1060401000000000000' }
      ],
      auditProductDialogVisible: false,
      selectedProuctRow: null //选择的商品数据
    };
  },
  created() {
    this.initParams();
  },
  methods: {
    //初始化参数
    initParams() {
      const { messageContent, sendUserId } = this.$route.query;
      if (sendUserId && messageContent && this.roleType === 1) {
        this.params.commonSearch = messageContent;
        this.params.commonTag = 4;
      }
      this.getDataList();
    },
    closedeleteProductDialog() {
      this.auditProductDialogVisible = false;
    },
    //搜索产品
    handleSearch() {
      this.params.pageNum = 1;
      this.params.pageSize = 20;
      this.getDataList();
    },
    //获取表格数据
    async getDataList() {
      this.tableData = [];
      let res = await this.$api.get(this.$url.productAll, this.params);
      this.tableData = res.rows;
      this.params.total = res.total;
    },
    auditProductBtnClick(val) {
      this.selectedProuctRow = JSON.parse(JSON.stringify(val));
      this.showDilogBtn('auditProductDialogVisible');
    },
    //确认审核
    async confirmAuditProduct() {
      let idArr = [];
      let applyContent = null;
      if (this.multipleSelection.length > 0 && this.selectedProuctRow === null) {
        idArr = this.multipleSelection.map(val => val.id);
        applyContent = this.multipleSelection.map(val => val.productBrandArticleNoName).join(',');
      } else {
        idArr.push(this.selectedProuctRow.id);
        applyContent = this.selectedProuctRow.productBrandArticleNoName;
      }
      let res = await this.$api.post(this.$url.productAudit, idArr);
      const { messageContent, sendUserId, messageId } = this.$route.query;
      if (sendUserId && applyContent == messageContent) {
        await this.$api.post(this.$url.message, { messageTitle: '产品审批', messageContent: messageContent + '产品审核已通过，已纳入公共数据，您可在公共数据中继续添加相关信息', receiveUserId: sendUserId });
        await this.$api.get(this.$url.messageDetail, { id: messageId });
      }
      this.closedeleteProductDialog();
      if (res.code === 200) {
        this.$message.success('审核通过');
        this.handleSearch();
      } else {
        this.$message.success('审核失败');
      }
    },
    //批量审核
    batchAuitBtn() {
      if (this.multipleSelection.length === 0) {
        return this.$message.warning('请选择需要审核的数据');
      }
      this.showDilogBtn('auditProductDialogVisible');
    }
  }
};
</script>
<style lang="less" scoped>
.table_content {
  height: calc(100% - 49px);
}
</style>
